
*, *::before, *::after {
    /**
    所以的标签和伪元素都选中
    */
    margin: 0;
    padding: 0;
    /*
       移动端以流式布局为主(百分百布局)
       非固定像素布局,无法准确计算容器的尺寸
       通过下面的设置,可以防止内容的溢出,出现滚动条的情况,提高了用户的体验
       box-sizing:代表的是元素大小的计算方式,通过设置border-box,那么就意味着元素的大小是border+content的和
    */
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    /*点击高亮效果的清除*/
    tap-highlight-color: transparent;
    -webkit-tap-highlight-color: transparent;
}

/**
设置全局的字体的大小,颜色,字体
*/
body {
    font-size: 14px;
    color: #333;
    font-family: "Microsoft YaHei", sans-serif;
}

/**
清除ol和ul的固定的list-style
*/
ul, ol {
    list-style: none;
}

/**
清除a的标记属性,和颜色
*/
a {
    text-decoration: none;
    color: #333;
}

/**
由于input存在阴影部分,我们通过这些设置
textarea设置不能从新设置大小,既不能拖拽
*/
input, textarea {
    border: none;
    outline: none;
    /*不能重新设置大小*/
    resize: none;
    /**元素的外观 none没有任何样式(浏览器的差异性)*/
    -webkit-appearance: none;
}

/**
    下面是一个公用的样式,实现的是对整个界面的简化操作
*/
/*------------common css--------------------*/
.f_left {
    float: left;
}

.f_right {
    float: right;
}

/**
通过在元素之前或之后插入生成的内容来清除浮动带来的界面布局乱掉的效果
 */
.clearFix::before,
.clearFix::after {

    /**
    与 :before 以及 :after 伪元素配合使用，来插入生成内容。
     */
    content: "";
    display: block;
    visibility: hidden;
    height: 0;
    line-height: 0;
    clear: both;
}

.m_l10 {
    margin-left: 10px;
}

.m_r10 {
    margin-right: 10px;
}

.m_t10 {
    margin-top: 10px;
}

.m_b10 {
    margin-bottom: 10px;
}

/**=========================================**/
/**, *::before, *::after {*/
/*margin: 0;*/
/*padding: 0;*/
/*box-sizing: border-box;*/
/*-webkit-box-sizing: border-box;*/
/*-webkit-tap-highlight-color: transparent;*/
/*}*/

/*body {*/
/*font-size: 14px;*/
/*color: #ccc;*/
/*font-family: "Microsoft YaHei", sans-serif;*/
/*}*/

/*ul, ol {*/
/*list-style: none;*/
/*}*/

/*a {*/
/*text-decoration: none;*/
/*color: #333;*/
/*}*/

/*input, textarea {*/
/*border: none;*/
/*outline: none;*/
/*resize: none;*/
/*-webkit-appearance: none;*/
/*}*/

body {
    background: #f8f8f8;
}

.container {
    min-width: 320px;
    max-width: 640px;
    width: 100%;
    margin: 0 auto;
    /*background: #38f;*/
}

.head {
    width: 100%;
    position: relative;
}

.head .leftMenu {
    position: absolute;
    width: 40px;
    height: 40px;
    background: url("../imgs/navMenu.png") no-repeat 15px 10px/20px 20px;
}

.head .rightMenu {
    position: absolute;
    right: 15px;
    top: 14px;
    width: 16px;
    height: 16px;
    background: url("../imgs/rightNavMenu.png") no-repeat 0 0/16px 16px;
}

/**

下面是logo的实现部分
 */

.logo {
    width: 60%;
    margin: 0 auto;
    padding-top: 70px;
    height: 70px;
    padding-bottom: 100px;
    text-align: center;
}

.logo img {
    max-width: 173px;
    width: 100%;
}

/**
下面是搜索的部分
 */

.searchBox {
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
    height: 64px;
    background: #ffffff;
    padding-bottom: 20px;
}

.searchBox .searchInner {
    border: 1px solid #111111;
    width: 100%;
    position: relative;
    height: 100%;
    padding-left: 10px;
}

.searchBox .inputSearch {
    width: 75%;
    height: 42px;
    border-right: 1px solid #e1e1e1;
}

.searchBox .searchButton {
    width: 25%;
    position: absolute;
    font-weight: bold;
    color: #38f;
    font-size: 16px;
    line-height: 42px;
    text-align: center;
    height: 100%;
}

/**
下面是广告的部分的实现
 */

.ad {
    width: 100%;
    max-height: 200px;
    position: relative;
    margin-top: 10px;
    padding-bottom: 20px;
    background: #ffffff;
    padding-top: 20px;
}

.ad .close {
    position: absolute;
    right: 15px;
    display: block;
    top: 15px;
    width: 11px;
    height: 11px;
    background: url("../imgs/close.png") no-repeat 0 0/11px 11px;
}

.ad .ad_row1 {
    width: 100%;
    text-align: center;
    position: relative;
}

.ad img {
    max-width: 40px;
}

.ad .adText1 {
    font-size: 22px;
    font-weight: bold;
}

.ad .open {
    border: 1px solid #36f;
    padding: 2px 5px;
    margin-left: 10px;
    border-radius: 14px;
    width: 67px;
    display: inline-block;
}

.ad .ad_row1:last-child p {
    margin-top: 10px;
    color: #555;
    font-size: 16px;
}

.news {
    margin-top: 10px;
    padding: 10px 10px;
    min-height: 200px;
    background: #ffffff;
}

.news p:first-child {
    font-size: 18px;
    color: #333;
}

.news .top {
    max-width: 44px;
    color: #ec4345;
}

.news .top::before {
    width: 13px;
    content: '';
    margin-right: 10px;
    margin-top: 15px;
    display: inline-block;
    height: 13px;
    background: url("../imgs/top.png") no-repeat 0 0/13px 13px;
}

.news span:last-child {
    margin-left: 10px;
    color: #999;
    font-size: 13px;
}

.news .divider {
    height: 1px;
    margin-top: 15px;
    background: #f2f2f2;
}

.new1Box {
    margin-bottom: 10px;
}

.news .new1-tit {
    font-size: 18px;
    color: #333;
    margin: 10px 0px;
}

.news .img1 {
    width: 33%;
    margin-right: 0.5%;
    float: left;
}

.news .img1:last-child {
    margin-right: 0;
}

.news li.new1-phos img {
    width: 100%;
}

.new2 {
    margin-top: 10px;
    width: 100%;
}

.new2 .new2Box {

    display: inline-block;
}

.new2 span:first-child {

}

/**

通用样式
 */

.source {
    font-size: 13px;
    display: inline-block;
    text-overflow: ellipsis;
    color: #999;
}






















